<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>WeParty | Admin</title>
  <script src="https://cdn.staticfile.org/vue/2.4.2/vue.min.js"></script>
  <script src="https://cdn.staticfile.org/vue-router/2.7.0/vue-router.min.js"></script>
  <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
  <script src="https://cdn.bootcss.com/jsencrypt/3.0.0-beta.1/jsencrypt.js"></script>
  <link rel="stylesheet" href="index.css">
  <link rel="stylesheet" href="login.css">
  <link rel="stylesheet" href="home.css">
  <link rel="stylesheet" href="sidebar.css">
  <link rel="stylesheet" href="page.css">
  <link rel="stylesheet" href="main.css">
  <link rel="stylesheet" href="check.css">
</head>

<body>
  <div id="app">
    <router-view></router-view>
  </div>
</body>

<!-- template -->
<!-- 登录的页面 -->
<template id="login">
  <div class="login-container">
    <!-- <button @click="login()">LOGIN</button> -->
    <!-- <router-link to="/home">进入主页面</router-link> -->
    <article class="card">
      <svg t="1600105778522" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
        p-id="5305" width="128" height="128">
        <path
          d="M228.66944 828.72832C263.03488 727.88992 358.56384 655.36 471.04 655.36h81.92c112.47104 0 208.00512 72.52992 242.37056 173.36832C882.25792 750.91968 936.96 637.8496 936.96 512c0-234.7008-190.2592-424.96-424.96-424.96s-424.96 190.2592-424.96 424.96c0 125.8496 54.70208 238.91968 141.62944 316.72832zM512 1024C229.23264 1024 0 794.76736 0 512S229.23264 0 512 0s512 229.23264 512 512-229.23264 512-512 512z m0-430.08c-98.9696 0-179.2-80.2304-179.2-179.2s80.2304-179.2 179.2-179.2 179.2 80.2304 179.2 179.2-80.2304 179.2-179.2 179.2z"
          p-id="5306" fill="#87CEFA"></path>
      </svg>
      <!-- 这个ref，还不会真正原理，要学 -->
      <input type="text" placeholder="Account" v-model="account" ref="account"></input>
      <input type="password" placeholder="Password" v-model="password" ref="password"></input>
      <div class="login" @click="login()">
        <svg t="1600142372890" class="icon" viewBox="0 0 1098 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
          p-id="3662" width="128" height="128">
          <path
            d="M476.808045 0.000043C213.401753 0.106685-0.031993 213.68973 0 477.074693S213.551052 953.98938 476.94668 954.021373s476.957344-213.412417 477.085315-476.808045A477.010665 477.010665 0 0 0 476.808045 0.000043z m273.761252 353.369671L441.861388 661.853674a43.1901 43.1901 0 0 1-62.023117 0L202.214984 484.251715a43.864079 43.864079 0 1 1 62.033781-62.033782l147.21959 147.21959 277.89897-276.86454a43.861946 43.861946 0 1 1 62.023117 62.033781z m0 0"
            fill="#87CEFA" p-id="3663"></path>
        </svg>
      </div>
    </article>
  </div>
</template>

<template id="home">
  <div class="home-container">
    <!-- 边边 -->
    <div id="sidebar" class="sidebar-container">
      <section class="tab-container">
        <router-link to="/home/main" class="tab">
          <svg t="1600088775385" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
            p-id="10598" width="32" height="32">
            <path
              d="M563.2 102.4h358.4v256H563.2v-256z m0 819.2V460.8h358.4v460.8H563.2z m-460.8 0v-256h358.4v256H102.4z m0-358.4V102.4h358.4v460.8H102.4z"
              fill="#87CEFA" p-id="10599"></path>
          </svg>
          主页
        </router-link>
        <router-link to="/home/check" class="tab">
          <svg t="1600085835633" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
            p-id="4739" width="32" height="32">
            <path
              d="M97 870.3h830v89.6H97v-89.6z m768.7-238.9H664.3c-18.2-20.8-31.1-44.4-33.2-70.9-8.6-108.2 111.4-160 111.4-292.8C742.5 155 654.1 64.1 512 64.1c-142.2 0-230.6 90.9-230.6 203.6 0 132.7 120.1 184.5 111.4 292.8-2.1 26.5-15 50.1-33.2 70.9H158.3c-33.9 0-61.3 26.7-61.3 59.6v119.6h830V691c0-32.9-27.5-59.6-61.3-59.6z"
              p-id="4740" fill="#87CEFA"></path>
          </svg>
          审核
        </router-link>
        <router-link to="/home/set" class="tab">
          <svg t="1600085991103" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
            p-id="7837" width="32" height="32">
            <path
              d="M881 512c0-52.4 32.9-96.8 79-114.5-11-43.2-28-83.9-50.2-121.3C864.6 296.3 810 288.1 773 251c-37-37-45.2-91.7-25.1-136.8C710.4 92 669.7 75 626.5 64c-17.8 46.1-62.2 79-114.5 79-52.4 0-96.8-32.9-114.5-79-43.2 11-83.9 28-121.3 50.2 20.1 45.2 11.9 99.8-25.1 136.8-37 37-91.7 45.2-136.8 25.2C92 313.6 75 354.3 64 397.5c46.1 17.8 79 62.2 79 114.5 0 52.4-32.9 96.8-79 114.5 11 43.2 28 83.9 50.2 121.3C159.4 727.7 214 735.9 251 773c37 37 45.2 91.7 25.1 136.8C313.6 932 354.3 949 397.5 960c17.8-46.1 62.2-79 114.5-79 52.4 0 96.8 32.9 114.5 79 43.2-11 83.9-28 121.3-50.2-20.1-45.2-11.9-99.8 25.1-136.8 37-37 91.7-45.2 136.8-25.2C932 710.4 949 669.7 960 626.5c-46.1-17.7-79-62.1-79-114.5zM512 635c-67.9 0-123-55.1-123-123s55.1-123 123-123 123 55.1 123 123-55.1 123-123 123z"
              fill="#87CEFA" p-id="7838"></path>
          </svg>
          设置
        </router-link>
      </section>
    </div>

    <!-- 路由匹配到的组件将渲染在这里 -->
    <article class="page">
      <router-view></router-view>
    </article>
  </div>
</template>

<template id="page-main">
  <div class="page-main-container">
    <div class="header-container">
      <div class="header">校园活动管理 | 管理员平台</div>
    </div>
    <article class="article">
      <!-- 左边个人信息 -->
      <div class="my-info">
        <!-- 头像 -->
        <svg t="1600149718282" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
          p-id="5552" width="128" height="128">
          <path
            d="M511.95 0.1C229.178 0.1 0 229.278 0 512.05S229.178 1024 511.95 1024s511.95-229.178 511.95-511.95C1024 229.278 794.822 0.1 511.95 0.1z m347.866 813.52C814.521 714.83 729.63 638.439 624.54 606.04c55.395-36.496 92.191-99.39 92.191-170.783 0-113.088-91.791-204.88-204.88-204.88s-204.88 91.792-204.88 204.88c0 71.394 36.696 134.287 92.191 170.984-105.09 32.397-189.981 108.79-235.177 207.58C93.691 732.928 50.995 627.739 50.995 512.15c0-254.575 206.28-460.855 460.855-460.855 254.575 0 460.855 206.28 460.855 460.855 0.1 115.389-42.796 220.578-112.889 301.47z"
            p-id="5553" fill="#87CEFA"></path>
        </svg>
        <div class="info-container">
          <span class="info-item">昵称: {{globalData.user.userName}}</span>
          <span class="info-item">账号: {{globalData.account}}</span>
          <span class="info-item">ID: {{globalData.user.id}}</span>
          <span class="info-item">年龄: {{globalData.user.age}}</span>
          <span class="info-item">性别: {{globalData.user.gender}}</span>
          <span class="info-item">学工号: {{globalData.user.userNumber}}</span>
        </div>
      </div>
      <!-- 右边未知区域 -->
      <div class="control-container"></div>
    </article>
  </div>
</template>

<template id="page-check">
  <article class="page-check-container">
    <div class="table">
      <!-- table -->
      <table>
        <thead>
          <tr>
            <th>ID</th>
            <th>Name</th>
            <th>Publisher ID</th>
            <th>Start</th>
            <th>End</th>
            <th>Location</th>
            <th>Detail</th>
            <th>Check</th>
          </tr>
        </thead>
        <tbody>
          <tr v-for="(item, index) in app.activityList">
            <td width="10%">{{item.activityId}}</td>
            <td width="10%">{{item.activityName}}</td>
            <td width="10%">{{item.publisherId}}</td>
            <td width="10%">{{item.activityStart}}</td>
            <td width="10%">{{item.activityEnd}}</td>
            <td width="10%">{{item.activityLocation}}</td>
            <td width="10%">
              <span @click="seeDetail(item)">查看简介</span>
            </td>
            <td>
              <span class="pass" @click="pass(item.activityId, index)">PASS</span>
              <span class="deny" @click="deny(item.activityId, index)">DENY</span>
            </td>
          </tr>
        </tbody>
      </table>
      <button @click="prePage()" v-if="app.currentCheckPage != 0">上一页</button>
      <button @click="nextPage()">下一页</button>
      <!-- mask -->
      <div id="mask" v-if="showDetail">
        <div class="mask">
          <div class="title">
            活动简介
            <span @click="showDetail = false">×</span>
          </div>
          <div class="content">
            <span>{{detail}}</span>
          </div>
        </div>
      </div>
    </div>
  </article>
</template>

<template id="page-set">
  <div>page-set</div>
</template>

<!-- 一定要放在后面 -->
<script src="index.js"></script>

</html>